<template>
    <div style="width: 100%;height: 100%;overflow: auto;" class="main" >
    <div style="background-color: white;width: 1020px;height:650px;position: relative;left: 110px;top:20px;border-radius: 5px;">
        <div style="width: 100%;height:50px;">
            <img src="@/assets/项目图标.png" style="width:40px;position: absolute;top:5px;left:8px;"/>
            <h1 style="font-size: 20px;font-weight: 1000;position: absolute;top:8px;left:50px;">AI教学设计</h1>
            <h3 style="font-size: 11px;position:absolute;top: 19px;left: 155px;">|Teaching integration</h3>
        </div>
        <div style=" position: absolute;width:100%;height:calc(100% - 50px);top:50px;">
          <RouterView/>
      </div>
    </div>
    </div>
</template>
<script setup lang="ts">
</script>
<style scoped>
::-webkit-scrollbar {
    width: 5px; /* 滚动条的宽度 */
    height: 5px;
  }
 
::-webkit-scrollbar-track {
    background: #e3e6e9e3; /* 滚动条轨道的背景 */
  }
 
::-webkit-scrollbar-thumb {
    background: #c2d0df; /* 滑块的颜色 */
    border-radius: 6px; /* 滑块的圆角 */
  }
 
::-webkit-scrollbar-thumb:hover {
    background: #a0a0a0; /* 当鼠标悬停在滑块上时的颜色 */
  }


::v-deep .el-step__icon {
  width: 30px; /* 调整步骤圈圈的宽度 */
  height: 30px; /* 调整步骤圈圈的高度 */
  line-height: 30px; /* 调整步骤圈圈内文字的行高 */
  font-size: 17px;
}
</style>